<template>
	<div class="tele_wrapper">
		<idenheader leftTitle="网贷黑名单" rightData="数据来自P2P平台"></idenheader>
		<div v-show="black.queryState === 'SUCCESS'" class="shenfen_nopass">有网贷黑名单记录</div>
		<div v-show="!black.queryState || black.queryState != 'SUCCESS'" class="shenfen_pass">此人没有相关记录</div>
		<div class="shenfen_info">
			<div v-if="black.p2pBlackList && showNew">
				<ul class="m-list" v-for="item in black.p2pBlackList">
	                <li>
	                    <label>逾期次数</label>
	                    <span>{{item.overduecount}}</span>
	                </li>
	                <li>
	                    <label>逾期金额</label>
	                    <span>{{item.overAmount}}</span>
	                </li>
	                <li>
	                    <label>还款状态</label>
	                    <span>{{item.overduedaysmost}}</span>
	                </li>
	            </ul>
	        </div>
			
			<div v-if="black.p2pBlackList && !showNew">
				<ul class="m-list" v-for="item in black.p2pBlackList">
					<li>
						<label>贷款金额</label>
						<span>{{item.loanAmount}}</span>
					</li>
					<li>
						<label>逾期金额</label>
						<span>{{item.overAmount}}</span>
					</li>
					<li>
						<label>还款状态</label>
						<span>{{item.state}}</span>
					</li>
					<li>
						<label>发布日期</label>
						<span>{{item.publishDate}}</span>
					</li>
					<li>
						<label>信息本源</label>
						<span>{{item.publishSource}}</span>
					</li>
				</ul>
			</div>

		</div>
	</div>
</template>

<script>
	import idenheader from '../common/idenheader';
	export default {
		data(){
			return{
				listHeight: [],
				scrollY: 0,
				showNew:true
			}
		},
		components:{
			idenheader
		},
		props:['black','blackReportType'],
		created(){
			if(this.blackReportType == "CUSTOM"){
				this.showNew=true;
			}else{
				this.showNew = false;
			}
		}
	}
</script>

<style scoped>
	.tele_wrapper{
		border: 1px solid #EDEDED;
	    border-radius: 2px 2px 3px 3px;
	}
	.shenfen_info{
		padding: 0 17px;
	}
	.shenfen_pass{
		padding: 0 17px;
		height: 36px;
		line-height: 36px;
	    color: #808080;
	    border-bottom: 1px solid #EDEDED;
	}
	.shenfen_nopass{
		padding: 0 17px;
		height: 36px;
		line-height: 36px;
        color: #ff4949;
        border-bottom: 1px solid #EDEDED;
	}
	.m-list{
		padding-top: 10px;
	}
	.m-list li{
		list-style: none;
		margin-bottom:10px;
		font-size: 1.2rem;
	}
	.m-list li label{
		text-align: justify;
    	color: #9b9b9b;
    }
    .m-list li span{
	    color: #212121;
	    margin-left: 16px;
    }
</style>